<template>
	<view style="display:flex;flex-direction:column;width:100%;height:100%;">
		
		<!-- 游戏容器 -->
		<view style="
			position:relative;
			height:750upx;
			display:flex;
			justify-content:center;
			align-items:center;
		">

			<!-- 砖块背景 -->
			<view style="position:absolute;top:0upx;left:0upx;right:0upx;bottom:0upx;">
				<view class="bg-home-1"></view>
			</view>
			
			<!-- 游戏地板背景 -->
			<view style="position:absolute;top:39upx;left:39upx;right:40upx;bottom:40upx;">
			    <view class="bg-game-1"></view>
			</view>			
			
			<!-- 游戏中显示的金币 -->
			<view style="position: absolute;top: 20upx;left: 40upx;">
				<view style="height: 40upx;
				display:flex; flex-direction:row;
				align-items: center;background-color: #2C405A;
				border-radius: 100px;position: absolute;">
				    <view style="width:50upx;"></view>
					<text style="color: #fff;font-size: 30upx;
					margin-right: 16upx;margin-left: 6upx;">{{jifen}}</text>
				</view>
				<view class="awga-jinbi-background-image" style="
				position: absolute;top: -17upx;left: -8upx;
				background-position: 0px 0px;
				transform:scale(0.75);transform-origin: left center;"></view>
			</view>
			
			<!-- 声音开关 -->
			<view style="position:absolute;top:12upx;right:34upx;">
				<view :class="[voice?'shengyin-ok':'shengyin-no']"></view>
			</view>			
			<view 
				@click="voiceClick" 
				:style="{top:startGos?'0rpx':'-100px'}"
				style="position:absolute;right:14upx;height:80upx;width:80upx;z-index:12;">
			</view>
			
			<!-- 墙上弹孔 -->
			<view style="position:absolute;top:0px;left:0px;right:0px;bottom:0px;">
				<block v-for="(item,index) in dankongArr" :key="index">
					<view :style="{
						position: 'absolute',
						top: item.top+'px',
						left: item.left+'px'
					}" style="width:50px;height:50px;transform:scale(0.5);transform-origin: center center;">
						<image style="width:100%;height:100%;" :src="dankongImg"></image>
					</view>
				</block>
			</view>
			
			<!-- 害虫 -->
			<view style="position:absolute;top:0px;left:0px;right:0px;bottom:0px;">
				<block v-for="(item,index) in haichongArr" :key="index">	
					<view :class="[
						item.stop?'stop-hidden-hc':'wupin-css'
					]" :data-index="index" :style="{
						position: 'absolute',
						top: item.top+'px',
						left: item.left+'px'
					}">
						<view class="css-xuanzhuang" :style="{
							width: 78+(item.hc_dj*4)+'rpx',
							height: 78+(item.hc_dj*4)+'rpx',
							transform:item.transform
						}" :class="[item.animation?item.animation:'css-img-gif-'+item.id]">
							
							<!-- 背上的等级数字 -->
							<view :class="'hc_dj-css-'+item.hc_dj"></view>
							
						</view>
					</view>
				</block>
			</view>
			
			<!-- 覆盖虫子上面的爆炸 -->
			<view style="position:absolute;top:0px;left:0px;right:0px;bottom:0px;">
				<block v-for="(item,index) in kaiqiangBz" :key="index">
					<view v-if="item.is" :style="{
						position:'absolute',
						top:item.top+'px',
						left:item.left+'px'
					}" style="width:100px;height:100px;display:flex;justify-content:center;align-items:center;">
						
						<!-- 一级抢爆炸 -->
						<view class="kaiqing-baoza-yi kaiqing-baoza-animation"></view>
						
						<!-- 三级火箭筒爆炸 -->
						<!-- <view class="baoza-css-xh baoza-css-animation"></view> -->
						
					</view>
				</block>
			</view>
			
			<!-- 添加金币动画 -->
			<view style="position:absolute;top:0px;left:0px;right:0px;bottom:0px;">
				<block v-for="(item,index) in jinbiArr" :key="index">
					<view v-if="item.is" :style="{
						position:'absolute',
						top:item.top+'px',
						left:item.left+'px'
					}" class="add-JB-dH">
					    <view class="awga-jinbi-background-image add-jinbi-animation"></view>
					</view>
				</block>
			</view>			
			
			<!-- 瞄准器 -->
			<view class="qiankou-go" :style="{opacity:startGos?1:0}">
				<image style="width:50px;height:50px;opacity:0.8;" :src="sheImg"></image>
				<!-- 爆炸 -->
				<view class="awga-baoza" :style="{
					transform: baoza?'scale(0.6)':'scale(0.2)',
					opacity: baoza?1:0
				}">
				    <view class="yiji-mianzhuanqi-1"></view>
				</view>
			</view>
			
			<!-- 窗帘幕布左 -->
			<view class="awga-transform" style="position:absolute;top:0;bottom:0;left:0;right:50%;"
			    :style="{transform:startGos?'translateX(-100%)':'translateX(0)'}"
			>
				<view class="awga-chuanglian-bg" style="background-position: 0px 0px;">
					<!-- 金币 -->
					<view style="position: absolute;top: 80upx;left: 80upx;">
						<view style="height: 40upx;
						display:flex; flex-direction:row;
						align-items: center;background-color: #2C405A;
						border-radius: 100px;position: absolute;">
						    <view style="width:50upx;"></view>
							<text style="color: #fff;font-size: 30upx;
							margin-right: 16upx;margin-left: 0upx;">{{jifen}}</text>
						</view>
						<view class="awga-jinbi-background-image" style="
						position: absolute;top: -17upx;left: -8upx;
						background-position: 0px 0px;
						transform:scale(0.75);transform-origin: left center;"></view>
					</view>
					
				</view>
			</view>
			
			<!-- 窗帘幕布右 -->
			<view class="awga-transform" style="position:absolute;top:0;bottom:0;left:50%;right:0;"
			    :style="{transform:startGos?'translateX(100%)':'translateX(0)'}"
			>
				<view class="awga-chuanglian-bg" style="background-position: -50vw 0px;">
					
					<!-- 贡献 -->
					<view style="position: absolute;top: 80upx;right:100upx;display:flex;flex-direction: row-reverse;">
						<view style="height: 40upx;
						display:flex; flex-direction:row;
						align-items: center;background-color: #2C405A;
						border-radius: 100px;position: absolute;">
							<text style="color: #fff;font-size: 30upx;
							margin-right: 0upx;margin-left: 16upx;">{{parseInt(gongxian)}}</text>
							<view style="width:30upx;"></view>
						</view>
						
						<image style="position:absolute;right:-28upx;top:-8upx;
						width:54upx;height:54upx;" :src="gongxianImg"></image>
						
					</view>
					
				</view>
			</view>
			
			<!-- 介绍 -->
			<view v-if="startGos===false&&noteData" style="position: absolute;left:100upx;padding:20upx;
			right:100upx;top:500upx;background-color:rgba(250, 240, 250, 0.5);border-radius: 2px;">
				<text style="font-size:28upx;color:#333;line-height:34upx;">
					{{noteData}}
				</text>
			</view>			
			
			<!-- 标题第几关 -->
			<view class="awga-transform" style="position:absolute;left:0;right:0;height:39upx;
			color: #333;font-weight:bold;text-align:center;z-index:11;
			display:flex;justify-content:center;"
			    :style="{
					top:startGos?'0':'30%',
					transform:startGos?'scale(1)':'scale(1.7)'
				}"
			>
				<view @click="clickLevel" style="background-color:rgba(250, 240, 250, 0.5);
				padding-left:10upx;padding-right:10upx;border-radius: 2px;
				position:relative;height:39upx;font-size:30upx;line-height:39upx;">
					{{dijiguan}}
				</view>
			</view>
			
			<!-- 更新至第几关标签 -->
			<view v-if="startGos===false&&levelTag" style="position:absolute;left:0;right:0;
			color: #333;font-weight:bold;text-align:center;
			display:flex;justify-content:center;top:30%;">
				
				<view style="position:relative;top:-50upx;right:-108upx;">
					<view style="background-color:#2C405A;color:#fff;font-size:12px;transform:scale(0.7);
					border-radius:10px;border-bottom-left-radius:0px;padding:6upx;">
						<text style="font-size:20upx;margin-left:6upx;margin-right:6upx;">
							{{levelTag}}
						</text>
					</view>
				</view>
				
			</view>			
			
			<!-- 开始游戏按钮 也用于定位瞄准器 -->
			<view v-if="startGos===false" style="position: absolute;top: 0;bottom: 0;left: 0;right: 0;
			display: flex;justify-content: center;align-items: center;">
				<view @click="wxsjs.start" style="
				background-color: #c19000;width:100px;position: relative;display: flex;flex-direction: column;
				align-items: center;
				height:50px;border-radius: 8px;border-bottom-left-radius: 8px;
				">
					<view style="text-align:center;background-color:#fbbd08;font-weight:bold;
					width: 100%;
					height:42px;line-height:42px;border-top-left-radius:8px;
					border-top-right-radius:8px;color:#2C405A;">开始游戏</view>
					
					<view v-if="costPay" style="position: absolute;display:flex;top:44px;
					align-items: center;background-color: #c19000;border-radius:2px;">
						<text style="line-height:30upx;font-size:26upx;margin-left:6upx;margin-right:6upx;">
							消耗{{costPay}}
						</text>
						<image style="width:30upx;height:30upx;" :src="gongxianImg"></image>
						
					</view>
					
				</view>
			</view>
			
			<!-- 显示子弹 -->
			<view v-if="startGos" @click="zidanAdd" class="awx-zidans" :class="[
				bullet>0?'awx-zidans-o':'awx-zidans-n'
			]" style="position:absolute;bottom:-20upx;right:36upx;">
				<view v-if="bullet>0" style="margin-left: 48upx;
				margin-top: 10upx;width: 64upx;height: 38upx;
				line-height: 38upx;text-align:center;font-weight:bold;font-size:26upx;color:#fff;">
					{{bullet}}
				</view>
			</view>
			
		</view>
		
		
		<view class="shoubing-bg">
			
			<!-- 手柄 -->
			<view class="sheji-margin-css sheji-anniu" style="transform:scale(0.8);transform-origin: center bottom;" :style="{
				flexDirection:zhuanhuan?'row-reverse':'row'
			}">
				<!-- 拖动瞄准器 -->
				<view class="tuodong-shoubing">
					<view 
						@touchstart="wxsjs.touchstart" 
						@touchmove="wxsjs.touchmove" 
						@touchend="wxsjs.touchend"
						class="tuodong-hexin tuodongdingwei" 
						style="position: absolute;top:25px;left:25px;"
					>
						<view style="" class="shoubings"></view>
					</view><!-- filter:sepia(10%); -->
				</view>
				
				<!-- 切换手柄方向 -->
				<view style="flex: 1;display: flex;justify-content: center;align-items: center;">
					<image @click="zhuanhuanClick" style="width:36px;height:36px;opacity:0.8;" :src="mianzhuanqi"></image>
				</view>
				
				<!-- 瞄准器射击 -->
				<view @touchend="getCssStyle" @touchstart="getKaisStart" class="tuodong-shoubing" :style="{
					backgroundColor:getKaisStarts?'#ed3f14':'rgba(250, 250, 250, 0.3)'
				}" style="position:relative;">
					<view class="tuodong-hexin1">
						<image style="width:50px;height:50px;" :src="sheImg"></image>
					</view>
				</view>
				
			</view>
			
		</view>
		
		
		
		

		<!-- #ifdef MP-WEIXIN -->
		<haichongAdVideo ref="awgaAdVideoRef" @loadState="loadState" @adData="adData"></haichongAdVideo>
		<!-- #endif -->
		<haichongComplete ref="awgaCompleteRef" @startClick="startClick"></haichongComplete>
		<haichongLevel ref="awgaLevelRef" @levelIndex="levelIndex"></haichongLevel>
		<haichongZidan ref="awgaZidanRef" @ZidanClick="ZidanClick"></haichongZidan>
		
		
		
		
		
		<!-- 广告 -->
<!-- 		<view style="position:fixed;bottom:40upx;left:40upx;right:40upx;z-index:500;">
			<awga-adBanner></awga-adBanner>
			<awga-iphoneX></awga-iphoneX>
		</view> -->
		
	</view>
</template>
<script src="./index.wxs" module="wxsjs" lang="wxs"></script>
<script>
	
	import haichongAdVideo from './haichong-AdVideo.vue';//视频广告
	import haichongComplete from './haichong-complete.vue';//游戏结束，成功或失败
	import haichongLevel from './haichong-level.vue';//游戏关卡
	import haichongZidan from './haichong-zidan.vue';//游戏结束，成功或失败
	// "./siteinfo.js"  
	import siteinfo from './siteinfo.js';
	// var siteinfo = require("./siteinfo.js");
	var awgaFun = require("./function.js");
	
	var aTime = new Date().getTime();
	export default {
		components: {
			haichongComplete,
			haichongLevel,
			haichongAdVideo,
			haichongZidan
		},
		data() {
			return {
				gongxianImg: siteinfo.gongxianImg,
				jifen: siteinfo.jifen?siteinfo.jifen:0,
				gongxian: siteinfo.gongxian,
				levelTag: siteinfo.levelTag,
				
				startGos: false,//是否开始游戏
				
				//当前关卡信息
				dijiguan: '',//第几关文字
				costPay: 0,//消耗贡献
				noteData: '',//备注信息
				haichongArr: [],//害虫
				bullet: 0,//子弹
				videosDy: 0,//本关看视频补充弹药（可补充多少）
				levelIndexId: 0,//当前选中的关卡
				kaiqiangBz: [],//覆盖虫子上面的爆炸
				jinbiArr: [],//添加金币
				baoza: false,
				
				prepareJb: 0,//待添加金币(应用隐藏 || 页面卸载 || 闯关结束 就请求添加，除程序崩溃外没毛病)
				voice: true,//声音
				
				//瞄准器图片
				sheImg: '',
				//墙上弹孔
				dankongImg: '',
				//手柄方向切换图标
				mianzhuanqi: '',
				
				//墙上弹孔
				dankongArr: [],
				
				getKaisStarts: false,//点击准备开枪，松手开枪
				
				zhuanhuan: false//切换手柄方向
				
			}
		},
		onHide(){
			this.update_guanqia_jinbi();
		},
		onUnload(){
			this.update_guanqia_jinbi();
		},
		onLoad(){
			
			var userLevel = siteinfo.userLevel?siteinfo.userLevel:0;
			try {
			    const pd = uni.getStorageSync('GameHaichongData');
			    if (JSON.stringify(pd) != "{}" && pd != null && pd != "" && pd != undefined) {
			        if(pd.userLevel){
						userLevel = pd.userLevel;
					}
					if(pd.gongxian){
						this.gongxian = pd.gongxian;
					}
					if(pd.jifen){
						this.jifen = pd.jifen;
					}
			    }
			} catch (e) {}
			
			//选中关卡
			this.levelIndex(userLevel);
			//虫子跑起来
			this.kaishiGos();
		},
		methods: {
			//虫子爬来爬去
			kaishiGos(){
				var _me = this;
				var shijian = 1000;
				var intervalId = setInterval(() => {
					if(_me.haichongArr.length>=1){
						for (var i = 0; i < _me.haichongArr.length; i++) {
							if(_me.haichongArr[i].stop===false){
								_me.xiugaihs(_me.haichongArr[i],i);
							}
						}
					}else{
						//clearInterval(intervalId);
					}
				}, shijian);
			},
			//渲染虫子
			addHaichongArr(hcDt){
				var upx750 = uni.upx2px(750);
				var sjs = awgaFun.randomNum(1,3);
				if(sjs==1){//左边出现
					var topCx = awgaFun.randomNum(0,upx750);
					var leftCx = -300;
				}else if(sjs==2){//右边出现
					var topCx = awgaFun.randomNum(0,upx750);
					var leftCx = 1050;
				}else{//上边出现
					var topCx = -300;
					var leftCx = awgaFun.randomNum(0,upx750);
				}
				this.haichongArr.push({
					id: hcDt.id,
					top: topCx,
					left: leftCx,
					hc_dj: hcDt.tl,//害虫体力
					transform: 'rotate(0deg)',
					animation: '',
					stop: false
				});
			},
			//虫子跑起来
			xiugaihs(e,index){
				if(e.stop){return;}//停止，该害虫已死
				
				var upx650 = uni.upx2px(650);
				
				var this_top = awgaFun.randomNum(0,upx650);
				var this_left = awgaFun.randomNum(0,upx650);
				
				if(e.top==this_top){
					this_top++;
				}
				if(e.left==this_left){
					this_left++;
				}
				
                var aDeg = 0;
				var pcTop = e.top - this_top;
				var pcLeft = e.left - this_left;
				if(pcTop<0&&pcLeft<0){//右下
				    var aTop = this_top - e.top;
				    var aLeft = this_left - e.left;
					if(Math.abs(pcTop)>Math.abs(pcLeft)){
						var sTop = aTop / 45;
						var bilis = aLeft / sTop;
						aDeg = 180 - bilis;
					}else{
						var sLeft = aLeft / 45;
						var bilis = aTop / sLeft;
						aDeg = 90 + bilis;
					}
				}else if(pcTop<0&&pcLeft>0){//左下
				    var aTop = this_top - e.top;
				    var aLeft = e.left - this_left;
					if(Math.abs(pcTop)>Math.abs(pcLeft)){
						var sTop = aTop / 45;
						var bilis = aLeft / sTop;
						aDeg = 180 + bilis;
					}else{
						var sLeft = aLeft / 45;
						var bilis = aTop / sLeft;
						aDeg = 270 - bilis;
					}
				}else if(pcTop>0&&pcLeft<0){//右上
				    var aTop = e.top - this_top;
				    var aLeft = this_left - e.left;
					if(Math.abs(pcTop)>Math.abs(pcLeft)){
						var sTop = aTop / 45;
						var bilis = aLeft / sTop;
						aDeg = bilis;
					}else{
						var sLeft = aLeft / 45;
						var bilis = aTop / sLeft;
						aDeg = 90 - bilis;
					}
				}else if(pcTop>0&&pcLeft>0){//左上
					var aTop = e.top - this_top;
					var aLeft = e.left - this_left;
					if(Math.abs(pcTop)>Math.abs(pcLeft)){
						var sTop = aTop / 45;
						var bilis = aLeft / sTop;
						aDeg = 0 - bilis;
					}else{
						var sLeft = aLeft / 45;
						var bilis = aTop / sLeft;
						aDeg = -90 + bilis;
					}
				}
				
				if(Math.abs(pcTop)>Math.abs(pcLeft)){
					var vpaodTime = Math.abs(pcTop);
				}else{
					var vpaodTime = Math.abs(pcLeft);
				}
				var dengj = e.id;
				if(vpaodTime>=600){
					var this_animation = 'css-img-gif-'+dengj+'-05';
				}else if(vpaodTime>=500){
					var this_animation = 'css-img-gif-'+dengj+'-1';
				}else if(vpaodTime>=400){
					var this_animation = 'css-img-gif-'+dengj+'-2';
				}else if(vpaodTime>=300){
					var this_animation = 'css-img-gif-'+dengj+'-3';
				}else if(vpaodTime>=200){
					var this_animation = 'css-img-gif-'+dengj+'-4';
				}else if(vpaodTime>=100){
					var this_animation = 'css-img-gif-'+dengj+'-5';
				}else{
					var this_animation = 'css-img-gif-'+dengj+'-6';
				}
				//跑起来
				var isXuanran = awgaFun.randomNum(2,3);
				if(isXuanran==1){
					this.haichongArr[index].animation = '';
				}else{
					this.haichongArr[index].animation = this_animation;
					this.haichongArr[index].transform = 'rotate('+aDeg+'deg)';
					this.haichongArr[index].left = this_left;
					this.haichongArr[index].top = this_top;
				}
			},
			//切换手柄方形
			zhuanhuanClick(){
				this.zhuanhuan = !this.zhuanhuan;
				//this.$refs.awgaCompleteRef.awgaShow(this.zhuanhuan);
			},
			//点击准备射击
			getKaisStart(){
				if(this.startGos===false){return;}
				this.getKaisStarts = true;
			},
			//射击
			getCssStyle(){
				
				//未点击开始
				if(this.startGos===false){return;}
				
				var _me = this;
				const query = uni.createSelectorQuery().in(this);
				query.select('.qiankou-go').boundingClientRect(data => {
					
				    //console.log('开枪');
					var bTime = new Date().getTime();
					if((bTime-aTime)>=300&&this.getKaisStarts){
						
						if(this.bullet<=0){
							this.$refs.awgaZidanRef.awgaShow(this.videosDy);
							this.getKaisStarts = false;
							return;
						}
						
						this.bullet--;//子弹减少
						
						if(this.voice){
							awgaFun.shootPlay();//枪声
						}
						
						aTime = new Date().getTime();
						
						_me.baoza = true;
						setTimeout(() => {
							_me.baoza = false;
						},200);
						
						var data_top = data.top;
						var data_left = data.left;
						
						var zxKaiqTop = data.top + 25;//中心点
						var zxKaiqLeft = data.left + 25;
						
						var kaiqTop = data.top + 24;//25是一半
						var kaiqLeft = data.left + 24;
						var kaiqBottom = kaiqTop + 2;
						var kaiqRight = kaiqLeft + 2;
						
						query.selectAll('.wupin-css').boundingClientRect(datas => {
							
							var dazhongs = [];
							for (var i = 0; i < datas.length; i++) {

								var index = datas[i].dataset.index;
								
								var wpTop = datas[i].top + (datas[i].height * 0.1);
								var wpLeft = datas[i].left + (datas[i].width * 0.1);
								var wpBottom = (datas[i].top + datas[i].height) - (datas[i].height * 0.2);
								var wpRight = (datas[i].left + datas[i].width) - (datas[i].width * 0.2);
								
								var kaiqiangweizhi = datas[i];
								//kaiqiangweizhi.top = zxKaiqTop - 25;
								//kaiqiangweizhi.left = zxKaiqLeft -25;
								
								if(kaiqTop>=wpTop&&kaiqTop<=wpBottom){
									if(kaiqLeft>=wpLeft&&kaiqLeft<=wpRight){//顶左
									    this.dazhongOk(kaiqiangweizhi);
										dazhongs.push(kaiqiangweizhi);//datas[i]
									}else if(kaiqRight>=wpLeft&&kaiqRight<=wpRight){//顶右
										this.dazhongOk(kaiqiangweizhi);
										dazhongs.push(kaiqiangweizhi);
									}
								}else if(kaiqBottom>=wpTop&&kaiqBottom<=wpBottom){
									if(kaiqLeft>=wpLeft&&kaiqLeft<=wpRight){//低左
										this.dazhongOk(kaiqiangweizhi);
										dazhongs.push(kaiqiangweizhi);
									}else if(kaiqRight>=wpLeft&&kaiqRight<=wpRight){//低右
										this.dazhongOk(kaiqiangweizhi);
										dazhongs.push(kaiqiangweizhi);
									}
								}
								//console.log(wpTop,wpLeft,wpRight,wpBottom);
								//console.log(kaiqTop,kaiqLeft,kaiqRight,kaiqBottom);
							}
							
							if(dazhongs.length>=1){
								
								//覆盖虫子上面的爆炸
								this.kaiqiangBz.push({
									top: zxKaiqTop - 50,
									left: zxKaiqLeft - 50,
									is: 1
								});//避免渲染过多
								setTimeout(() => {
									for (var i = 0; i < _me.kaiqiangBz.length; i++) {
									    if(_me.kaiqiangBz[i].is==1){
											_me.kaiqiangBz[i].is = 0;
											break;
										}
									}
								},3000);
								
								//批量添加金币
								this.piliangAddJinbi(dazhongs);
								
							}else{
								this.dankongArr.push({
									top: data_top,
									left: data_left
								});
							}
							
						}).exec();
					}
					this.getKaisStarts = false;
				}).exec();
			},
			//打中一只一只虫子操作 
			dazhongOk(data){//console.log(data);
				var _me = this;
				
				var index = data.dataset.index;
				
				//减少害虫体力
				this.haichongArr[index].hc_dj--;
				if(this.haichongArr[index].hc_dj==0){//停止，害虫已死
				    this.haichongArr[index].stop = true;
					this.haichongArr[index].left = data.left;
					this.haichongArr[index].top = data.top;
					setTimeout(() => {
						_me.jianceHaichongOk();
					},2000);
				}
			},
			//检测害虫是否全部死亡，游戏结束
			jianceHaichongOk(){
				var jieshu = true;
				for (var i = 0; i < this.haichongArr.length; i++) {
					if(this.haichongArr[i].stop === false){
						jieshu = false;
					}
				}
				if(jieshu){
					//uni.showToast({icon:'none',title:'游戏结束',duration: 2000});
					this.$refs.awgaCompleteRef.awgaShow(true);
					this.startGos = false;
				}
			},
			//批量添加金币
			piliangAddJinbi(dataArr){
				var _me = this;
				for (var i = 0; i < dataArr.length; i++) {
					this.prepareJb++;//预备添加的金币
					var dataSao = dataArr[i];
				    setTimeout(() => {
						_me.jifen++;//添加金币显示，但没有时间添加 prepareJb 是预备需要添加的金币
						//添加金币动画
						var wpTop = dataSao.top + (dataSao.height * 0.5) - 20;
						var wpLeft = dataSao.left + (dataSao.width * 0.5) - 20;
						_me.jinbiArr.push({
							top: wpTop,
							left: wpLeft,
							is: 1
						});//删除添加的金币元素
						setTimeout(() => {
							for (var i = 0; i < _me.jinbiArr.length; i++) {
							    if(_me.jinbiArr[i].is==1){
									_me.jinbiArr[i].is = 0;
									break;
								}
							}
						},3000);
					},100*i);
				}
			},
			//wxs回调开始游戏(用于定位瞄准器位置)
			wxsStartGo(e){//e===false 需要验证扣积分 否则直接游戏 
			    var _me = this;
				if(this.gongxian<this.costPay){
					uni.showModal({
						title: siteinfo.gongxianName+'不足',
						content: '可点击看视频广告开始游戏',
						confirmText: '看视频',
						success: function (res) {
							if (res.confirm) {
								_me.$refs.awgaAdVideoRef.showAd('startGame');
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
					return;
				}else if(this.costPay>0){
					uni.showLoading({
						mask: true,
					    title: '加载中...'
					});
					var str = this.dijiguan.replace(/\s*/g,"");//去除所有空格
					awgaFun.post('deduct_gongxian', {
						gongxian: _me.costPay,
						note: '消灭害虫消耗['+str+']'
					},  function(res){//console.log('res',res);
					        uni.hideLoading();
							if(res.errno == 1){
								_me.startGos = true;
								_me.gongxian = res.data.gongxian;
								_me.$refs.awgaLevelRef.updateLevel(res.data.userLevel);
								uni.setStorage({key:'GameHaichongData',data:{
									userLevel: res.data.userLevel,
									gongxian: res.data.gongxian,
									jifen: res.data.jifen
								}});
								
								try {if(res.data.uni_emit&&res.data.uni_emit.constructor === Object){
									uni.$emit(siteinfo.uni_emit,res.data.uni_emit);
								}} catch (e) {}
								
							}else{
								uni.showToast({icon:'none',title:res.message,duration: 2000});
							}
						}
					);
				}else if(this.costPay==0){
					this.startGos = true;
				}
			},
			//声音开关
			voiceClick(){
				this.voice = !this.voice;
			},
			//下一关||重玩本关
			startClick(e){
				var _me = this;
				var guanqia = this.levelIndexId;
				if(e){
					guanqia++;
				}
				console.log(e,guanqia,this.levelIndexId);
				//已经没有更多关卡了
				if(guanqia>=10){
					uni.showModal({
						title: '关卡未更新('+guanqia+')',
						content: '抱歉，目前仅更新到10关，更多关卡敬请期待...',
						confirmText: '重玩本关',
						success: function (resi) {
							
							uni.showLoading({
								mask: true,
								title: '加载中...'
							});
							awgaFun.post('update_guanqia_jinbi', {
								guanqia: _me.levelIndexId--,
								jinbi: _me.prepareJb
							},  function(res){//console.log('res',res);
									uni.hideLoading();
									if(res.errno == 1){
										_me.jifen = res.data.jifen;
										_me.gongxian = res.data.gongxian;
										_me.prepareJb = 0;
										_me.levelIndex(_me.levelIndexId--);
										_me.$refs.awgaLevelRef.updateLevel(res.data.userLevel);
										uni.setStorage({key:'GameHaichongData',data:{
											userLevel: res.data.userLevel,
											gongxian: res.data.gongxian,
											jifen: res.data.jifen
										}});
										try {if(res.data.uni_emit&&res.data.uni_emit.constructor === Object){
											uni.$emit(siteinfo.uni_emit,res.data.uni_emit);
										}} catch (e) {}
									}else{
										uni.showToast({icon:'none',title:res.message,duration: 2000});
									}
								}
							);
							
						}
					});
					return;
				}
				uni.showLoading({
					mask: true,
				    title: '加载中...'
				});
				awgaFun.post('update_guanqia_jinbi', {
					guanqia: guanqia,
					jinbi: _me.prepareJb
				},  function(res){//console.log('res',res);
						uni.hideLoading();
						if(res.errno == 1){
							_me.jifen = res.data.jifen;
							_me.gongxian = res.data.gongxian;
							_me.prepareJb = 0;
							_me.levelIndex(guanqia);
							_me.$refs.awgaLevelRef.updateLevel(res.data.userLevel);
							uni.setStorage({key:'GameHaichongData',data:{
								userLevel: res.data.userLevel,
								gongxian: res.data.gongxian,
								jifen: res.data.jifen
							}});
							try {if(res.data.uni_emit&&res.data.uni_emit.constructor === Object){
								uni.$emit(siteinfo.uni_emit,res.data.uni_emit);
							}} catch (e) {}
						}else{
							uni.showToast({icon:'none',title:res.message,duration: 2000});
						}
					}
				);
				//console.log(e);
			},
			//更新积分（应用隐藏 页面卸载）
			update_guanqia_jinbi(){
				var _me = this;
				awgaFun.post('update_guanqia_jinbi', {
					guanqia: _me.levelIndexId,
					jinbi: _me.prepareJb
				},  function(res){
						if(res.errno == 1){
							_me.jifen = res.data.jifen;
							_me.gongxian = res.data.gongxian;
							_me.prepareJb = 0;
							_me.$refs.awgaLevelRef.updateLevel(res.data.userLevel);
							uni.setStorage({key:'GameHaichongData',data:{
								userLevel: res.data.userLevel,
								gongxian: res.data.gongxian,
								jifen: res.data.jifen
							}});
							try {if(res.data.uni_emit&&res.data.uni_emit.constructor === Object){
								uni.$emit(siteinfo.uni_emit,res.data.uni_emit);
							}} catch (e) {}
						}
					}
				);
			},
			//选关，非游戏中可选
			clickLevel(){
				if(this.startGos !== true){
					this.$refs.awgaLevelRef.awgaShow();
				}
			},
			//选中关卡
			levelIndex(indexs){
				this.levelIndexId = parseInt(indexs);
				var _me = this;
				var lexe = siteinfo.levelArr[this.levelIndexId];
				console.log(this.levelIndexId,indexs,lexe);
				this.dijiguan = lexe.title;
				this.costPay = lexe.cost;
				this.noteData = lexe.note;
				this.bullet = lexe.bullet;
				this.videosDy = parseInt(lexe.bullet * 0.5);
				this.haichongArr = [];
				this.dankongArr = [];
				this.kaiqiangBz = [];
				this.jinbiArr = [];
				lexe.haichongArr.forEach(function(item, index) {
				    _me.addHaichongArr(item);
				});
			},
			//视频广告加载情况
			loadState(e){
				console.log(e);
			},
			//视频广告看完回帖
			adData(e){
				if(e==='startGame'){
					this.startGos = true;
				}else if(e==='zidanGame'){
					this.bullet = this.bullet + this.videosDy;
					this.videosDy = parseInt(this.videosDy * 0.5);
					uni.showToast({icon:'none',title:'弹药补给成功',duration: 2000});
				}
				//console.log(e);
			},
			//添加子弹
			zidanAdd(){
				if(this.bullet<=0){
					this.$refs.awgaZidanRef.awgaShow(this.videosDy);
				}
			},
			//补充弹药回调
			ZidanClick(e){
				if(e=='end'){//结束游戏
					this.$refs.awgaCompleteRef.awgaShow(false);
					this.startGos = false;
				}else if(e=='video'){
					this.$refs.awgaAdVideoRef.showAd('zidanGame');
				}
			}
		},
		onShareAppMessage: function (res) {
		    return awgaFun.onShareApp('hy');
		},
		onShareTimeline: function (res) {
		    return awgaFun.onShareApp('pyq');
		}
	}
</script>

<style>
	@import "./index.css";
	.shoubing-bg{
		flex:1;
		width: 100%;height: 100%;
		background-image: url('');
		background-repeat:no-repeat;
		background-size:100% 100%;
	}
	.css-xuanzhuang{
		transition-timing-function: ease;
		transition-duration: 0.3s;
		transition-property: transform,width,height;
		background-repeat:no-repeat;
		background-size:100% 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>
